import React from "react";
import { Navigate, BrowserRouter, useRoutes } from "react-router-dom";
const Home = React.lazy(() => import("../pages/home"));
const List = React.lazy(() => import("../pages/list"));
const MainLayout = React.lazy(() => import("../pages/mainLayout"));
const ListAdd = React.lazy(() => import("../pages/listAdd"));

const routes = [
  {
    path: "/",
    element: <Navigate to="/home"></Navigate>,
  },
  {
    path: "/home",
    element: (
      <MainLayout>
        <Home></Home>
      </MainLayout>
    ),
  },
  {
    path: "/list",
    element: (
      <MainLayout>
        <List></List>
      </MainLayout>
    ),
  },
   {
    path: "/list/add",
    element: (
      <MainLayout>
        <ListAdd></ListAdd>
      </MainLayout>
    ),
  },
];

const Router = () => {
	const App = () => useRoutes(routes)
	return (
		<BrowserRouter>
			<App></App>
		</BrowserRouter>
	)
}

export default Router


